<template>
  <view>
    <!-- pages/companyInfo/index.wxml -->
    <Nav nav-type="title" titleText="企业信息" />
    <scroll-view
      slot="panel"
      class="list"
      scroll-y
      refresher-enabled
      :refresher-triggered="loading"
      @refresherrefresh="getData"
    >
      <t-input
        label="单位名称"
        placeholder="请输入"
        disabled
        v-model:value="companyInfo.name"
      ></t-input>
      <t-input
        label="统一社会信用代码"
        placeholder="请输入"
        disabled
        v-model:value="companyInfo.uscCode"
      ></t-input>
      <t-input
        label="所辖街道"
        placeholder="请输入"
        disabled
        v-model:value="companyInfo.parentName"
      ></t-input>
      <t-input
        label="主要负责人"
        placeholder="请输入"
        disabled
        v-model:value="companyInfo.supervisorName"
      ></t-input>
      <t-input
        label="主要负责人联系方式"
        placeholder="请输入"
        disabled
        v-model:value="companyInfo.supervisorMobile"
      ></t-input>

      <!-- 可编辑区域 S -->
      <t-input
        label="安全管理人员"
        placeholder="请输入"
        v-model:value="companyInfo.securityName"
        :disabled="!isEdit"
      ></t-input>
      <t-input
        label="安全管理人员联系方式"
        placeholder="请输入"
        v-model:value="companyInfo.securityMobile"
        :disabled="!isEdit"
      ></t-input>

      <WhqylbSelect
        title="危化企业类别"
        v-model:label="companyInfo.dangerTypeName"
        v-model:value="dangerTypeCode"
        :disabled="!isEdit"
      />

      <t-input
        label="储油（气）罐数量"
        placeholder="请输入"
        v-model:value="companyInfo.gasBucketNum"
        :disabled="!isEdit"
        type="number"
      ></t-input>
      <t-input
        label="总容积"
        placeholder="请输入"
        v-model:value="companyInfo.capacity"
        :disabled="!isEdit"
        type="number"
      ></t-input>
      <t-input
        label="加油机数量"
        placeholder="请输入"
        v-model:value="companyInfo.oilPumpNum"
        :disabled="!isEdit"
        type="number"
      ></t-input>
      <t-input
        label="从业人员数量"
        placeholder="请输入"
        v-model:value="companyInfo.workerNum"
        :disabled="!isEdit"
        type="number"
      ></t-input>
      <t-input
        label="安全生产标准化达标等级"
        placeholder="请输入"
        v-model:value="companyInfo.securityQualifiedLevel"
        :disabled="!isEdit"
      ></t-input>

      <DateSelect
        title="安全生产标准化达标时间"
        :disabled="!isEdit"
        v-model:value="companyInfo.securityQualifiedDate"
      />

      <DateRangeSelect
        title="安全评价报告时间"
        :disabled="!isEdit"
        v-model:start="companyInfo.appraiseReportStartDate"
        v-model:end="companyInfo.appraiseReportEndDate"
      />

      <t-input
        label="危险化学品经营许可证证号"
        placeholder="请输入"
        v-model:value="companyInfo.dangerLicenseCode"
        :disabled="!isEdit"
      ></t-input>

      <DateSelect
        title="危险化学品经营许可证有效期"
        :disabled="!isEdit"
        v-model:value="companyInfo.dangerLicenseExpireDate"
      />

      <LocationSelect
        title="位置信息"
        v-model:lng="companyInfo.lng"
        v-model:lat="companyInfo.lat"
        v-model:location="companyInfo.location"
        :disabled="!isEdit"
      />

      <!-- 可编辑区域 E -->
    </scroll-view>

    <view class="btn-box">
      <t-button
        v-if="!isEdit"
        size="large"
        theme="primary"
        shape="round"
        block
        @click="isEdit = true"
        >编辑</t-button
      >
      <t-button
        v-if="isEdit"
        size="large"
        theme="primary"
        shape="round"
        block
        @click="updateData"
        >提交更新</t-button
      >
      <t-button v-if="isEdit" size="large" shape="round" block @click="cancel"
        >取消</t-button
      >
    </view>
  </view>
</template>

<script>
import Nav from "@/components/nav";
import { companyInfo as companyInfoApi, updateCompanyInfo } from "/api/company";
import WhqylbSelect from "@/components/whqylbSelect/index.vue";
import DateSelect from "@/components/dateSelect/index.vue";
import DateRangeSelect from "@/components/dateRangeSelect/index.vue";
import LocationSelect from "@/components/locationSelect/index.vue";
// pages/companyInfo/index.js

const app = getApp();

export default {
  components: {
    Nav,
    WhqylbSelect,
    DateSelect,
    DateRangeSelect,
    LocationSelect,
  },
  data() {
    return {
      loading: false,
      isEdit: false,
      dangerTypeCode: [],
      timeRange: [],
      companyId: "",

      companyInfo: {
        id: "",
        typeCode: "",
        typeName: "",
        name: "",
        uscCode: "",
        streetCode: "",
        streetName: "",
        supervisorName: "",
        supervisorMobile: "",
        securityName: "",
        securityMobile: "",
        dangerTypeCode: "",
        dangerTypeName: "",
        gasBucketNum: 0,
        capacity: 0,
        oilPumpNum: 0,
        workerNum: 0,
        securityQualifiedLevel: "",
        securityQualifiedDate: "",
        appraiseReportStartDate: "",
        appraiseReportEndDate: "",
        dangerLicenseCode: "",
        dangerLicenseExpireDate: "",
        lng: 0,
        lat: 0,
        location: "",
        enabled: true,
        latestUpdater: {
          uid: "",
          name: "",
        },
        createTime: "",
        updateTime: "",
      },

      // 危化企业类型
      dangerTypeVisible: false,

      dangerTypeOptions: [
        [
          {
            label: "北京市",
            value: "北京市",
          },
          {
            label: "上海市",
            value: "上海市",
          },
          {
            label: "广州市",
            value: "广州市",
          },
          {
            label: "深圳市",
            value: "深圳市",
          },
          {
            label: "杭州市",
            value: "杭州市",
          },
          {
            label: "成都市",
            value: "成都市",
          },
          {
            label: "长沙市",
            value: "长沙市",
          },
        ],
      ],

      title: "",
    };
  },
  watch: {
    dangerTypeCode: {
      handler(val) {
        // console.log("dangerTypeCode:", val);
        this.companyInfo.dangerTypeCode = val.join(" ");
      },
      deep: true,
    },
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    console.log(app.globalData.userInfo);
    // console.log("企业id：", app.globalData.userInfo.orgs[0].id);
    this.companyId = app.globalData.userInfo.orgs[0].id;
  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {
    this.getData();
  },
  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {},
  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {},
  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {},
  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {},
  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {},
  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {},
  methods: {
    async getData() {
      if (this.loading) return;

      this.setData({
        loading: true,
      });

      const res = await companyInfoApi(this.companyId);

      this.setData({
        loading: false,
      });

      if (res.data) {
        this.setData({
          companyInfo: res.data,
        });
      }
    },
    async updateData() {
      if (this.loading) return;

      uni.showLoading({
        title: "提交中...",
        mask: true,
      });

      this.setData({
        loading: true,
      });

      try {
        const res = await updateCompanyInfo(this.companyInfo);

        this.setData({
          loading: false,
        });

        uni.hideLoading();

        if (res.code === 0) {
          this.isEdit = false;
          uni.showToast({
            title: "更新成功",
            icon: "none",
          });
        } else {
          uni.showToast({
            title: "更新失败，请稍后重试",
            icon: "none",
          });
        }
      } catch (error) {
        this.setData({
          loading: false,
        });

        uni.hideLoading();

        uni.showToast({
          title: "更新失败，请稍后重试",
          icon: "none",
        });
      }
    },

    cancel() {
      this.isEdit = false;
      this.getData();
    },
  },
};
</script>
<style lang="less">
/* pages/companyInfo/index.wxss */

.list {
  height: 78vh;
}

.btn-box {
  box-sizing: border-box;
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 0 30rpx;
  height: 100rpx;
  background-color: #fff;
  border-top: 1rpx solid #e5e5e5;
  position: absolute;
  bottom: 20rpx;
  width: 100%;
}
</style>
